<template>
  <view style="padding-bottom: 120rpx">
    <u-navbar
      v-if="!$isWeixin()"
      :title="title"
      :titleBold="true"
      :background="{ backgroundColor: '#ffffff' }"
      :is-fixed="true"
    ></u-navbar>

    <u-tabs active-color="#FF7A23" :list="tabList" :current="tabIndex" @change="index => (tabIndex = index)"></u-tabs>

    <view v-if="tabIndex == 0 && this.form.ApplyObjectType != 4">
      <u-cell-item
        v-if="state.ShowLevel != 3"
        :border-bottom="state.ShowLevel != 2"
        title="一级经销商名称"
        :arrow="false"
        :value="state.First_Dealer_BaseInfo.Name"
      ></u-cell-item>
      <u-cell-item
        v-if="state.ShowLevel == 3"
        title="二级经销商名称"
        :arrow="false"
        :value="state.Double_Dealer_BaseInfo.Name"
      ></u-cell-item>

      <basic-information
        :level="state.ShowLevel"
        :showOtherInfo="false"
        :showReview="false"
        :showParent="false"
        :showDeliveryAddress="false"
        :showKeDealerNo="false"
        :data="{ Dealer_BaseInfo: DealerInfo.Dealer_BaseInfo }"
        :loadCity="loadCity"
      ></basic-information>
    </view>

    <view
      class=""
      v-show="(tabIndex == 1 && form.ApplyObjectType != 4) || (tabIndex == 0 && form.ApplyObjectType == 4)"
    >
      <design-information-form
        :showApplyType="form.ApplyObjectType != 4"
        :isApply="true"
        ref="designForm"
        :showAudit="false"
      ></design-information-form>

      <u-gap :height="20" bg-color="#f5f5f5"></u-gap>
      <apply-form ref="applyForm"></apply-form>
    </view>

    <view class="btn-group-fixed">
      <u-button :disabled="btnDisabled" type="warning" @click="submit">保存提交</u-button>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      btnDisabled: false,

      title: '门头设计申请',
      tabList: [{ name: '基本信息' }, { name: '设计信息' }],
      tabIndex: 0,
      loadCity: false,

      SelectType: 1,

      state: {
        ShowLevel: 0,
        First_Dealer_BaseInfo: {},
        Double_Dealer_BaseInfo: {},
        Door_Dealer_BaseInfo: {},
        This_Dealer_OtherInfo: {},
        This_Dealer_RelationList: [],
        DealerAuditInfo: {},
        InitialPhotoList: []
      },

      form: {
        DealerId: '',
        ApplyObjectType: 1,
        Remark: '',
        ApplicationRemake: '',
        ApplicationDate: null,
        DoorPlane: 0,
        OutDoorAdvertising: 0,
        Media: 0,
        InitialPhotoList: [],
        DesignType: '',
        Aub_Brand: ''
      },

      DealerInfo: {
        Dealer_BaseInfo: {}
      }
    };
  },

  onLoad(options) {
    if (options.DealerId) {
      this.form.DealerId = options.DealerId;
    }
    if (options.SelectType) {
      this.SelectType = options.SelectType;
      this.form.ApplyObjectType = options.SelectType;

      if (options.SelectType == 2) {
        this.title = '专卖店设计申请';
      }
      if (options.SelectType == 3) {
        this.title = '店内&展会平面设计';
      }
      if (options.SelectType == 4) {
        this.title = '总部设计申请';
        this.tabList = [{ name: '设计信息' }];
      }
      if (options.SelectType == 5) {
        this.title = '渠道其他画面设计';
      }
    }
    this.init();

    this.$setTitle(this.title);
  },

  methods: {
    submit() {
      let me = this;
      me.btnDisabled = true;
      const designForm = this.$refs.designForm;
      const applyForm = this.$refs.applyForm;

      this.form = Object.assign(this.form, designForm.form);
      this.form.ApplicationDate = applyForm.form.ApplyTime;
      this.form.ApplicationRemake = applyForm.form.Remark;
      this.form.DesignType = designForm.form.DesignType;

      if (this.SelectType == 4) {
        this.form.ApplyObjectType = 4;
        this.form.SelectType = 4;
      }

      this.$u.api.saveDesignApply(this.form).then(res => {
        const { ResultCode, ResultMessage } = res;
        if (ResultCode === 1) {
          this.$u.toast(ResultMessage);

          setTimeout(() => {
            uni.navigateBack();
          }, 1000);
        } else {
          me.btnDisabled = false;
        }
      });
    },

    init() {
      this.$u.api
        .getInitDesignApply({
          DealerId: this.form.DealerId,
          SelectType: this.SelectType
        })
        .then(res => {
          console.log(res);
          const { ResultCode, ResultData } = res;
          if (ResultCode === 1) {
            this.state = ResultData;

            if (this.state.ShowLevel == 1) {
              this.DealerInfo.Dealer_BaseInfo = this.state.First_Dealer_BaseInfo;
            }

            if (this.state.ShowLevel == 2) {
              this.DealerInfo.Dealer_BaseInfo = this.state.Double_Dealer_BaseInfo;
            }

            if (this.state.ShowLevel == 3) {
              this.DealerInfo.Dealer_BaseInfo = this.state.Door_Dealer_BaseInfo;
            }

            let DesignTypeList = [];
            if (this.form.ApplyObjectType == 5) {
              DesignTypeList = this.state.GraphicDesigns;
            }
            if (this.form.ApplyObjectType == 4) {
              DesignTypeList = this.state.HeadquartersDesigns;
            }
            if (this.form.ApplyObjectType == 3) {
              DesignTypeList = this.state.OtherDesigns;
            }

            this.$refs.designForm.initForm({
              ApplyObjectType: this.form.ApplyObjectType,
              DesignTypeList
            });

            this.loadCity = true;
          }
        });
    }
  }
};
</script>

<style lang="scss"></style>
